<!doctype html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>首页</title>
  <meta name="description" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="robots" content="all,follow">
  <!-- Bootstrap CSS-->
  <link rel="stylesheet" th:href="@{/vendor/bootstrap/css/bootstrap.min.css}">
  <!-- Font Awesome CSS-->
  <link rel="stylesheet" th:href="@{/vendor/font-awesome/css/font-awesome.min.css}">
  <!-- Fontastic Custom icon font-->
  <link rel="stylesheet" th:href="@{/css/fontastic.css}">
  <!-- Google fonts - Roboto -->
  <link rel="stylesheet" >
  <!-- jQuery Circle-->
  <link rel="stylesheet" th:href="@{/css/grasp_mobile_progress_circle-1.0.0.min.css}">
  <!-- Custom Scrollbar-->
  <link rel="stylesheet" th:href="@{/vendor/malihu-custom-scrollbar-plugin/jquery.mCustomScrollbar.css}">
  <!-- theme stylesheet-->
  <link rel="stylesheet" th:href="@{/css/style.default.css}" id="theme-stylesheet">
  <!-- Custom stylesheet - for your changes-->
  <link rel="stylesheet" th:href="@{/css/custom.css}">
  <!-- Favicon-->
  <link rel="shortcut icon" th:href="@{/img/favicon.ico}">
  <!-- Tweaks for older IEs--><!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]-->

  <style>
    * {
      font-family: "宋体";
      font-size: 16px;

    }
  </style>

</head>
<body>
<div class="nk-container">
  <nav class="side-navbar" th:replace="index::left">
    <div class="side-navbar-wrapper">
      <!-- Sidebar Header    -->
      <div class="sidenav-header d-flex align-items-center justify-content-center">
        <!-- User Info-->
        <div class="sidenav-header-inner text-center"><img src="img/Klose.jpg" alt="person" class="img-fluid rounded-circle">
          <h2 class="h5">Nathan Andrews</h2><span>Web Developer</span>
        </div>
        <!-- Small Brand information, appears on minimized sidebar-->
        <div class="sidenav-header-logo"><a href="discussindex.html" class="brand-small text-center"> <strong>B</strong><strong class="text-primary">D</strong></a></div>
      </div>
      <!-- Sidebar Navigation Menus-->
      <div class="main-menu">
        <h5 class="sidenav-heading">Main</h5>
        <ul id="side-main-menu" class="side-menu list-unstyled">
          <li><a href="discussindex.html"> <i class="icon-home"></i>主页                             </a></li>
          <li><a href="forms.html"> <i class="icon-form"></i>某功能                             </a></li>
          <li><a href="charts.html"> <i class="fa fa-bar-chart"></i>仓库情况                            </a></li>
          <li><a href="tables.html"> <i class="icon-grid"></i>员工列表                          </a></li>
          <li><a href="#exampledropdownDropdown" aria-expanded="false" data-toggle="collapse"> <i class="icon-interface-windows"></i>库存管理 </a>
            <ul id="exampledropdownDropdown" class="collapse list-unstyled ">
              <li><a href="#">入库管理</a></li>
              <li><a href="#">出库管理</a></li>
              <li><a href="#">Page</a></li>
            </ul>
          </li>
          <li><a href="login.html"> <i class="icon-interface-windows"></i>Login page                             </a></li>
          <li> <a href="#"> <i class="icon-mail"></i>Demo
            <div class="badge badge-warning">6 New</div></a></li>
        </ul>
      </div>
      <div class="admin-menu">
        <h5 class="sidenav-heading">Second menu</h5>
        <ul id="side-admin-menu" class="side-menu list-unstyled">
          <li> <a href="#"> <i class="icon-screen"> </i>Demo</a></li>
          <li> <a href="#"> <i class="icon-flask"> </i>Demo
            <div class="badge badge-info">Special</div></a></li>
          <li> <a href=""> <i class="icon-flask"> </i>Demo</a></li>
          <li> <a href=""> <i class="icon-picture"> </i>Demo</a></li>
        </ul>
      </div>
    </div>
  </nav>

  <div class="page">
    <header class="header" th:replace="index::header">
      <nav class="navbar">
        <div class="container-fluid">
          <div class="navbar-holder d-flex align-items-center justify-content-between">
            <div class="navbar-header"><a id="toggle-btn" href="#" class="menu-btn"><i class="icon-bars"> </i></a><a href="discussindex.html" class="navbar-brand">
              <div class="brand-text d-none d-md-inline-block"><span>Bootstrap </span><strong class="text-primary">Dashboard</strong></div></a></div>
            <ul class="nav-menu list-unstyled d-flex flex-md-row align-items-md-center">
              <!-- Notifications dropdown-->
              <li class="nav-item dropdown"> <a id="notifications" rel="nofollow" data-target="#" href="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="nav-link"><i class="fa fa-bell"></i><span class="badge badge-warning">12</span></a>
                <ul aria-labelledby="notifications" class="dropdown-menu">
                  <li><a rel="nofollow" href="#" class="dropdown-item">
                    <div class="notification d-flex justify-content-between">
                      <div class="notification-content"><i class="fa fa-envelope"></i>You have 6 new messages </div>
                      <div class="notification-time"><small>4 minutes ago</small></div>
                    </div></a></li>
                  <li><a rel="nofollow" href="#" class="dropdown-item">
                    <div class="notification d-flex justify-content-between">
                      <div class="notification-content"><i class="fa fa-twitter"></i>You have 2 followers</div>
                      <div class="notification-time"><small>4 minutes ago</small></div>
                    </div></a></li>
                  <li><a rel="nofollow" href="#" class="dropdown-item">
                    <div class="notification d-flex justify-content-between">
                      <div class="notification-content"><i class="fa fa-upload"></i>Server Rebooted</div>
                      <div class="notification-time"><small>4 minutes ago</small></div>
                    </div></a></li>
                  <li><a rel="nofollow" href="#" class="dropdown-item">
                    <div class="notification d-flex justify-content-between">
                      <div class="notification-content"><i class="fa fa-twitter"></i>You have 2 followers</div>
                      <div class="notification-time"><small>10 minutes ago</small></div>
                    </div></a></li>
                  <li><a rel="nofollow" href="#" class="dropdown-item all-notifications text-center"> <strong> <i class="fa fa-bell"></i>view all notifications                                            </strong></a></li>
                </ul>
              </li>
              <!-- Messages dropdown-->
              <li class="nav-item dropdown"> <a id="messages" rel="nofollow" data-target="#" href="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="nav-link"><i class="fa fa-envelope"></i><span class="badge badge-info">10</span></a>
                <ul aria-labelledby="notifications" class="dropdown-menu">
                  <li><a rel="nofollow" href="#" class="dropdown-item d-flex">
                    <div class="msg-profile"> <img src="img/avatar-1.jpg" alt="..." class="img-fluid rounded-circle"></div>
                    <div class="msg-body">
                      <h3 class="h5">Jason Doe</h3><span>sent you a direct message</span><small>3 days ago at 7:58 pm - 10.06.2019</small>
                    </div></a></li>
                  <li><a rel="nofollow" href="#" class="dropdown-item d-flex">
                    <div class="msg-profile"> <img src="img/avatar-2.jpg" alt="..." class="img-fluid rounded-circle"></div>
                    <div class="msg-body">
                      <h3 class="h5">Frank Williams</h3><span>sent you a direct message</span><small>3 days ago at 7:58 pm - 10.06.2019</small>
                    </div></a></li>
                  <li><a rel="nofollow" href="#" class="dropdown-item d-flex">
                    <div class="msg-profile"> <img src="img/avatar-3.jpg" alt="..." class="img-fluid rounded-circle"></div>
                    <div class="msg-body">
                      <h3 class="h5">Ashley Wood</h3><span>sent you a direct message</span><small>3 days ago at 7:58 pm - 10.06.2019</small>
                    </div></a></li>
                  <li><a rel="nofollow" href="#" class="dropdown-item all-notifications text-center"> <strong> <i class="fa fa-envelope"></i>Read all messages    </strong></a></li>
                </ul>
              </li>
              <!-- Languages dropdown    -->
              <li class="nav-item dropdown"><a id="languages" rel="nofollow" data-target="#" href="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="nav-link language dropdown-toggle"><img src="img/flags/16/GB.png" alt="English"><span class="d-none d-sm-inline-block">English</span></a>
                <ul aria-labelledby="languages" class="dropdown-menu">
                  <li><a rel="nofollow" href="#" class="dropdown-item"> <img src="img/flags/16/DE.png" alt="English" class="mr-2"><span>German</span></a></li>
                  <li><a rel="nofollow" href="#" class="dropdown-item"> <img src="img/flags/16/FR.png" alt="English" class="mr-2"><span>French                                                         </span></a></li>
                </ul>
              </li>

              <li class="nav-item"><a href="login.html" class="nav-link login"> <span class="d-none d-sm-inline-block">Login</span><i class="fa fa-sign-in"></i></a></li>

              <li class="nav-item"><a href="Register.html" class="nav-link register"> <span class="d-none d-sm-inline-block">Register</span><i class="fa fa-registered"></i></a></li>

              <!-- Log out-->
              <li class="nav-item"><a href="login.html" class="nav-link logout"> <span class="d-none d-sm-inline-block">Logout</span><i class="fa fa-sign-out"></i></a></li>
            </ul>
          </div>
        </div>
      </nav>
    </header>



    <!-- 内容 -->
    <div class="main">
      <div class="container">
        <!-- 库存列表 -->
        <div class="col-lg-6">
          <div class="card">
            <div class="card-header">
              <h4>Striped Table</h4>
            </div>
            <div class="card-body">
              <div class="table-responsive">
                <table class="table table-striped">
                  <thead>
                  <tr>
                    <th>#</th>
                    <th>货物id</th>
                    <th>货名</th>
                    <th>价格</th>
                  </tr>
                  </thead>
                  <tbody th:each="map:${speciesSorts}">
                  <tr>
                    <th scope="row">1</th>
                    <td th:utext="${map.speciesSort.id}">Mark</td>
                    <td th:utext="${map.speciesSort.name}">Otto</td>
                    <td th:utext="${map.speciesSort.price}">@mdo</td>
                  </tr>

                  </tbody>
                </table>
              </div>
            </div>
          </div>
        </div>


        <!-- 分页 -->
        <nav class="mt-5" th:if="${page.rows>0}">
          <ul class="pagination justify-content-center">
            <li class="page-item">
              <a class="page-link" th:href="@{${page.path}(current=1)}">首页</a>
            </li>
            <li th:class="|page-item ${page.current==1?'disabled':''}|">
              <a class="page-link" th:href="@{${page.path}(current=${page.current-1})}">上一页</a></li>
            <li th:class="|page-item ${i==page.current?'active':''}|" th:each="i:${#numbers.sequence(page.from,page.to)}">
              <a class="page-link" href="#" th:text="${i}">1</a>
            </li>
            <li th:class="|page-item ${page.current==page.total?'disabled':''}|">
              <a class="page-link" th:href="@{${page.path}(current=${page.current+1})}">下一页</a>
            </li>
            <li class="page-item">
              <a class="page-link" th:href="@{${page.path}(current=${page.total})}">末页</a>
            </li>
          </ul>
        </nav>


        <!--购买!!!-->
        <div class="col-lg-6">
          <div class="card">
            <div class="card-header d-flex align-items-center">
              <h4>Horizontal Form</h4>
            </div>
            <div class="card-body">
              <p>Lorem ipsum dolor sit amet consectetur.</p>
              <form class="form-horizontal" method="post" th:action="@{/buy}">
                <div class="form-group row">
                  <label class="col-sm-2">货名</label>
                  <div class="col-sm-10">
                    <input id="fishname" type="text" name="name" placeholder="货名"
                           class="form-control form-control-success"><small class="form-text">Example
                    help text that remains unchanged.</small>
                  </div>
                </div>

                <div class="form-group row">
                  <label class="col-sm-2">重量</label>
                  <div class="col-sm-10">
                    <input id="weight" type="text" name="weight" placeholder="重量"
                           th:class="|form-control ${storeMsg!=null?'is-invalid':''}|"><small
                          class="invalid-feedback" th:text="${storeMsg}">Example help text that remains
                    unchanged.</small>
                  </div>
                </div>


                <div class="form-group row">
                  <label class="col-sm-2">地址</label>
                  <div class="col-sm-10">
                    <input id="address" type="text" name="address" placeholder="地址"
                           th:class="|form-control ${storeMsg!=null?'is-invalid':''}|"><small
                          class="invalid-feedback" th:text="${storeMsg}">Example help text that remains
                    unchanged.</small>
                  </div>
                </div>


                <div class="form-group row">
                  <div class="col-sm-10 offset-sm-2">
                    <input class="btn btn-primary" type="submit" value="确认购买">
                  </div>
                </div>
              </form>
            </div>
          </div>
        </div>





      </div>
    </div>

  </div>
</div>

<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/popper.js/umd/popper.min.js"> </script>
<script src="vendor/bootstrap/js/bootstrap.min.js"></script>
<script th:src="@{/js/grasp_mobile_progress_circle-1.0.0.min.js}"></script>
<script th:src="@{/vendor/jquery.cookie/jquery.cookie.js}"> </script>
<script th:src="@{/vendor/chart.js/Chart.min.js}"></script>
<script th:src="@{/vendor/jquery-validation/jquery.validate.min.js}"></script>
<script th:src="@{/vendor/malihu-custom-scrollbar-plugin/jquery.mCustomScrollbar.concat.min.js}"></script>
<script th:src="@{/js/charts-home.js}"></script>
<!-- Main File-->
<script th:src="@{/js/front.js}"></script>
</body>
</html>
